<template>
	<view class="user" @click="onClick">
		<image class="user-icon" :src="options.head||'../static/images/icon_user_head@3x.png'"></image>
		<view class="user-main">
			<view class="user-top">
				<label class="user-name">{{options.userName}}</label>
				<label class="user-company">{{options.company}}</label>
			</view>
			<view class="user-buttom">
				<label class="user-auth" v-if="options.isAuth">实名认证</label>
				<uni-rate v-if="options.score" class="user-score-rate" :readonly="true" :size="10" :value="options.score" />
				<label v-if="options.score" class="user-score">{{options.score}}</label>
				<label v-if="options.score" class="user-score-text">分</label>
			</view>
		</view>
		<view v-if="options.isArrow" class="user-item-arrow"></view>
	</view>
</template>

<script>
	export default {
		name:"user-Item-Card",
		props:{
			options:{
				type:Object,
				default:{
					id:"",
					head:"",
					userName:"沈燕",
					company:"公司名称某某某有限公司",
					isAuth:"false",
					score:"",
					isArrow:false
				}
			}
		},
		data() {
			return {
				
			};
		},methods:{
			onClick(){
				this.$emit("click",this.options.id)
			}
		}
	}
</script>

<style>
.user {
		display: flex;
		padding: 28rpx 32rpx;
		background-color: #FFFFFF;
		align-items: center;
		margin-bottom: 8rpx;
	}

	.user-icon {
		width: 88rpx;
		height: 88rpx;
		border-radius: 50%;
		margin-right: 28rpx;
		background-color: #007AFF;
	}

	.user-main {

		flex: 1;

	}

	.user-top {
		display: flex;
		align-items: center;
	}

	.user-buttom {
		display: flex;
		align-items: center;
	}

	.user-name {
		font-weight: 500;
		font-size: 36rpx;
		color: #202020;
		margin-right: 20rpx;
	}

	.user-company {
		color: #7B7B7B;
		font-size: 28rpx;
	}

	.user-score-rate {
		margin-left: 20rpx;
	}

	.user-score {
		color: #FFCC09;
		font-size: 24rpx;
		margin-left: 12rpx;
	}

	.user-score-text {
		font-size: 20rpx;
		color: #5A5A5A
	}
	.user-item-arrow {
		width: 32rpx;
		height: 32rpx;
		background: url(../static/images/icon_jinru@3x.png) center no-repeat;
		background-size: 32rpx;
	}
</style>
